React Native之虚线dashed属性在Android机不兼容问题解决

#React Native之虚线dashed属性在Android机不兼容问题解决| 来源: 网络整理| 查看: 265

borderStyle:"dashed" 在安卓机上无效果。iOS中可以正常显示虚线；但是安卓只能显示为实线。

我的解决办法：

lineOne:{ width:25, height:0, borderWidth:0.8, borderColor:'red', borderStyle:'dashed', borderRadius:0.1, }

解决点：

1. height设置为0， borderWidth设置为1（宽细自己考虑）

2. borderStyle设置为dashed

3.borderRadius设置成1和0.5；（我设置成了0.1真机Android调试最满意）

另外，附上最近github上各位老铁们的讨论：

borderStyle ‘dashed’ didn’t work when borderBottomWidth set #12817

=====================================================================================

更新，有更好的解决方法啦，我们老大提供的。很多时候，开发的思想真的很重要，换一种思路就会有新的天地：

思路：将虚线改成一个宽度为2,高度为1的view; 虚线就是5个这样的view，就能看出来是一条虚线了。

源码供上：

import React, {Component} from 'react'; import { Text, View, StyleSheet, } from 'react-native'; /*水平方向的虚线 * len 虚线个数 * width 总长度 * backgroundColor 背景颜色 * */ export default class DashLine extends Component { render() { var len = this.props.len; var arr = []; for (let i = 0; i < len; i++) { arr.push(i); } return { arr.map((item, index) => { return }) } } } const styles = StyleSheet.create({ dashLine: { flexDirection: 'row', }, dashItem: { height: 1, width: 2, marginRight: 2, flex: 1, } })

用法：

【本文地址】

公司简介

联系我们